<template>
  <div>
    <div class="i-layout-page-header">
      <PageHeader title="贷款处理" hidden-breadcrumb />
    </div>
    <div>
      <Card :bordered="false" dis-hover class="list-table-list-card ivu-mt" ref="card">
        <h2 style="font-size: 1.3em">借款详细信息</h2>
        <!--      <form-data v-bind:borrower="borrower" ></form-data>-->
        <Form ref="form" :model="borr" label-position="top" class="ivu-mt">
          <Row type="flex" :gutter="48">
            <Col v-bind="grid2">
              <FormItem label="" prop="name"> <span>贷款产品: </span>{{borr.productName}}
              </FormItem>
            </Col>
            <Col v-bind="grid2">
              <FormItem label="" prop="name"> <span>借方主体类型: </span>{{borr.borrowerType}}
              </FormItem>
            </Col>
            <Col v-bind="grid2">
              <FormItem label="" prop="name"> <span>借方主体名称: </span>{{borr.borrowerName}}
              </FormItem>
            </Col>
            <Col v-bind="grid2">
              <FormItem label="" prop="name"> <span>借方证件类型: </span>{{borr.borrowerCertificateType}}
              </FormItem>
            </Col>
          </Row>
          <Row type="flex" :gutter="48">
            <Col v-bind="grid2">
              <FormItem label="" prop="name"> <span>证件号码: </span>{{borr.borrowerCertificateNumber}}
              </FormItem>
            </Col>
            <Col v-bind="grid2">
              <FormItem label="" prop="name"> <span>手机号码: </span>{{borr.borrowerPhone}}
              </FormItem>
            </Col>
            <Col v-bind="grid2">
              <FormItem label="" prop="name"> <span>申请时间: </span>{{borr.time}}
              </FormItem>
            </Col>
            <Col v-bind="grid2">
              <FormItem label="" prop="name"> <span>申请状态: </span>{{borr.state}}
              </FormItem>
            </Col>
          </Row>

        </Form>
      </Card>
    </div>

<!--贷款处理记录-->

      <Card :bordered="false" dis-hover class="list-table-list-card ivu-mt" ref="card">
        <h2 style="font-size: 1.3em">贷款处理记录</h2>
        <br>
        <procession-list :id="id"></procession-list>
        <br>
        <br>
      </Card>

  </div>
</template>

<script>

    import ProcessionList from '@/pages/borrower/procession/procession-list';
    import { getBorrowerById } from '@/api/borrower';
    export default {
        components: { ProcessionList },
        name: 'borrower-procession',
        data () {
            return {
                borr: {},
                borrowerId: null,
                borrowerName: '陈',
                grid2: {
                    xl: {
                        span: 6,
                        order: 1
                    },
                    lg: {
                        span: 24,
                        order: 2
                    },
                    md: {
                        span: 24,
                        order: 2
                    },
                    sm: {
                        span: 24,
                        order: 2
                    },
                    xs: {
                        span: 24,
                        order: 2
                    }
                }
            }
        },
        beforeCreate: function () {
            this.borrowerId = this.$route.query.key;
            getBorrowerById({
                id: this.borrowerId
            })
                .then(res => {
                    this.borr = res.data[0];
                    console.log(this.borr)
                // 返回数据
                })
                .catch(err => {
                    console.log(err);
                // 异常情况
                })
                // this.borrower = this.$route.params.key;
                // console.log(this.borrower)
        },
        methods: {

        },
        created () {

        }
    }

</script>

<style scoped>
span{
  color: black;

}
</style>
